/**
 * header高度计算
 * 【胶囊height】 + 【胶囊top】 + 【自定义header padding-bottom】
 * 注意：
 *    1. 因为胶囊height和胶囊top写在行内样式，行内样式中同时存在 rpx 和 px 数值的时候，小程序渲染的时候计算变量会把行内样式  单位为rpx的数值 和 单位为px的数值 相互转换。
 *    2. 如果此节点class中有在 css 中添加参与高度计算的样式 会使得渲染完成的页面的  理想高度 和 实际高度 出现偏差
 *
 * 问题定位：
 *    1. 单位为rpx的数值 和 单位为px的数值 相互转换
 *
 * 解决办法：
 *    把【胶囊height】【胶囊top】【自定义header padding-bottom】 都写在行内样式中，即style，且单位统一为px，因为
 *    小程序api获取出来的【胶囊height】【胶囊top】单位就是px，所以可以直接使用，不需要二次转换
 *    :style=“{
 *       'height': height + 'px', // 胶囊距离顶部高度   px
 *       'padding-top': top + 'px', // 胶囊高度   px
 *       'padding-bottom': '8px' // 自定义header底部高度
 *    }”
 *
 */

export default function() {
	// #ifdef MP-WEIXIN
	// 系统信息
	// const systemInfo = uni.getSystemInfoSync();
	// 胶囊信息
	const capsuleButton = uni.getMenuButtonBoundingClientRect();

	// console.log(systemInfo) // systemInfo
	// console.log(capsuleButton, capsuleButton.top, capsuleButton.height) // px

	// 小程序API返回的 top 和 height 都是  px  自定义header需要使用 px做动态距离计算
	const top = capsuleButton.top // 胶囊距离顶部高度   px
	const height = capsuleButton.height // 胶囊高度   px
	// #endif
	// #ifdef H5
	const top = 20 // 胶囊距离顶部高度   px
	const height = 20 // 胶囊高度   px
	// #endif

	return {
		top,
		height
	}
}
